<template>
    <div class="app-container" style="overflow:scroll">
      <div style="width: 1024px;margin: 0 auto">
    <el-form ref="submitParams" :model="submitParams" :rules="rules"  label-width="80px" >

      <el-row>
        <el-col :span="12">
          <el-form-item :required="true" label="报文类型" prop="pkgNo">
            <el-select  v-model="submitParams.pkgNo"  placeholder="报文类型" style="width: 100%;"  @change="bizTypeChange" >
              <el-option
                v-for="dict in dictMap.PKG_310_312"
                :key="dict.value"
                :label = "`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item :required="true" label="系统编号" prop="sysCode">
            <el-select  v-model="submitParams.sysCode" clearable placeholder="系统编号" style="width: 100%;" >
              <el-option
                v-for="dict in dictMap.SYS_CODE_310_312"
                :key="dict.value"
                :label = "`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>


      <el-row>
        <el-col :span="12">
          <el-form-item label="业务类型" prop="bizType" >
            <el-select
              v-model="submitParams.bizType"
              placeholder="业务类型"
              @change="bizCtgyChange"
              style="width: 100%;"
            >
              <el-option
                v-for="dict in bizTypeList"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="业务种类" prop="bizCtgy" v-if="this.submitParams.pkgNo==='ccms.312.001.01'" >
            <el-select
              v-model="submitParams.bizCtgy"
              placeholder="业务种类"
              clearable
              style="width: 100%;"
            >
              <el-option
                v-for="dict in bizCtgyList"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
      <el-col :span="24">
        <el-form-item label="信息标题" prop="msgTitle" >
          <el-input v-model="submitParams.msgTitle"  />
        </el-form-item>
      </el-col>
      </el-row>

      <el-row>
      <el-col :span="24">
        <el-form-item label="信息内容" prop="msgContent" >
          <el-input type="textarea" v-model="submitParams.msgContent" show-word-limit  maxlength="256" />
        </el-form-item>
      </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="地域标识" prop="regionid"  v-if="this.submitParams.pkgNo==='ccms.312.001.01'&&this.submitParams.bizType==='M505'">
            <el-select
              v-model="submitParams.regionid"
              placeholder="地域标识"
              style="width: 100%;"
              clearable
            >
              <el-option
                v-for="dict in dictMap.RegionId"
                :key="dict.value"
                :label="`${dict.value}-${dict.text}`"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-card class="form-card txnInfo-card" v-if="this.submitParams.bizCtgy==='06814'">
        <div slot="header" class="label-header-msg">
          <span>存量协议信息通知</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="客户标识" prop="cstmrId" >
              <el-input v-model="submitParams.cstmrId" />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24">
            <el-form-item label="客户名称" prop="cstmrNm" >
              <el-input v-model="submitParams.cstmrNm"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24">
            <el-form-item label="协议号" prop="ctrctId" >
              <el-input v-model="submitParams.ctrctId"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="协议状态" prop="ctrctSts" >
              <el-select
                v-model="submitParams.ctrctSts"
                placeholder="协议状态"
                style="width: 100%;"
                clearable
              >
                <el-option
                  v-for="dict in dictMap.CTRCTSTS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>


      </el-card>

      <el-row>
        <el-col :span="12">
          <el-form-item :required="true" label="接收参与机构号" prop="rec" >
            <el-input v-model="submitParams.rec" @change="checkbankcode"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item>
            <el-button
              icon="el-icon-search"
              plain
              type="primary"
              @click="openBankBranchDialog"
            >行名行号查询</el-button>

          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="接收参与机构名称" prop="recName" >
            <el-input v-model="submitParams.recName" :disabled="true" />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="备注" prop="remarks">
            <el-input v-model="submitParams.remarks" maxlength="256" show-word-limit  type="textarea"/>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item :required="false" label="附件"  prop="attchmtName">
            <ht-upload-form-item
              ref="attachmentFormItem"
              :limit="{
                    size: 0,
                    fileCount: 1,
                    type: ['jpg','jpeg','png','gif','bmp','pdf','txt','xlsx','xls','doc','docx'],
              }"
              @successCallback="successCallback"
              v-model="submitParams.attchmtName"
              ></ht-upload-form-item>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item>
            <el-button type="primary" @click="submitForm">提 交</el-button>
            <el-button  @click="refresh">重 置</el-button>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>

    <bank-branch-dialog
      ref="bankBranchDialog"
      @confirm="confirmBankBranch"
    ></bank-branch-dialog>
  </div>
    </div>


</template>

<script>
import { findFreeEntry, generalInformationEntrySave } from '@/api/cnaps/ccms/310'
import { listPageMixin } from '@/libs/listPageMixin'
import BankBranchDialog from '@/views/components/BankBranchDialog'
import {getBankInfByBankCode} from "@/api/cnaps/common/bankInfo"
export default {
  name: "generalInformationEntry",
  mixins: [listPageMixin],
  components: { BankBranchDialog },
  computed:{
    condition () {
      return {
        pkgNo:true,
        sysCode:true,
        bizType:true,
        bizCtgy:this.submitParams.pkgNo==='ccms.312.001.01',
        msgTitle:true,
        msgContent:true,
        attchmtName:this.submitParams.bizType==='M500'||this.submitParams.bizType==='M501'||this.submitParams.bizType==='M502'||this.submitParams.bizType==='M503'||this.submitParams.bizType==='M504',
        regionid:this.submitParams.pkgNo==='ccms.312.001.01'&&this.submitParams.bizType==='M505',
        cstmrId:this.submitParams.bizCtgy==='06814',
        cstmrNm:this.submitParams.bizCtgy==='06814',
        ctrctId:this.submitParams.bizCtgy==='06814',
        ctrctSts:this.submitParams.bizCtgy==='06814',
        rec:true,
        recName:true,
        remarks:true
      }
    },
  },
  data() {

    return {
      bizTypeList:[],
      bizCtgyList:[],
      // 录入参数
      submitParams: {
        pkgNo:'ccms.310.001.01',
        sysCode:'',
        bizType:'',
        bizCtgy:'',
        msgTitle:'',
        msgContent:'',
        attchmtName:'',
        regionid:'',
        cstmrId:'',
        cstmrNm:'',
        ctrctId:'',
        ctrctSts:'',
        rec:'',
        recName:'',
        remarks:'',
        attchmtContent:'',
        attchmtLength:'',
      },

      //
      searchFormDictList: ["PKG_310_312","SYS_CODE_310_312","RegionId","CTRCTSTS"],


      rules: {
        pkgNo:[{required: true,message: "请输入报文类型",trigger: "blur"}],
        sysCode:[{required: true,message: "请输入系统编号",trigger: "blur"}],
        bizType:[{required: true,message: "请输入业务类型",trigger: "blur"}],
        bizCtgy:[{required: true,message: "请输入业务种类",trigger: "blur"}],
        msgTitle:[{required: true,message: "请输入信息标题",trigger: "blur"}
        ,{ max: 80, message: "长度最大为80位", trigger: "blur" }],
        msgContent:[{required: true,message: "请输入信息内容",trigger: "blur"}
          ,{ max: 256, message: "长度最大为256位", trigger: "blur" }],
        regionid:[{required: true,message: "请输入地域标识",trigger: "blur"}],
        rec:[{required: true,message: "请输入接收参与机构号",trigger: "blur"}
          ,{ max: 14, message: "长度最大为14位", trigger: "blur" }],
        recName:[{ max: 60, message: "长度最大为60位", trigger: "blur" }],
        remarks:[{ max: 256, message: "长度最大为256位", trigger: "blur" }],

      }
    };
  },
  mounted() {

   this.bizTypeChange(this.submitParams.pkgNo)

  },
  methods: {
    successCallback(res) {
      if (res.code === "S") {
        console.log(res);
        this.$set(this.submitParams, "attchmtName", res.result.fileOriginName);
        this.$set(this.submitParams, "attchmtContent", res.result.fileId);
        this.$set(this.submitParams, "attchmtLength", res.result.fileSize);
      }
    },

    //行名行号返回
    confirmBankBranch(fromFlag, row) {
      console.log("row", row);
      this.$set(this.submitParams, "rec", row.bankCode);
      this.$set(this.submitParams, "recName", row.orgFullname);

    },
    //行名行号查询
    openBankBranchDialog(fromFlag = "") {
      this.$refs.bankBranchDialog.show(fromFlag);
    },
    /** 提交按钮 */
    submitForm: function() {
      this.$refs["submitParams"].validate(valid => {
        if (valid) {
          generalInformationEntrySave(this.submitParams).then(res => {
            this.msgSuccess("录入成功");
            this.$alert(`CORE_ID: ${res.result.rspId}`, "生成交易流水号", {
              confirmButtonText: "确定",
              callback: (action) => {
              },
            });
            this.refresh();
          });
        }
      });
    },
    //点击重置按钮
    refresh(){
      this.resetForm("submitParams");
    },

    checkbankcode:function(){
      const rec = this.submitParams.rec;
      getBankInfByBankCode(rec).then(response => {
        if (response.code == 'S' && response.result !== null) {
          this.$set(this.submitParams, "rec", response.result.bankCode);
          this.$set(this.submitParams, "recName", response.result.orgFullname);
        }else{
          this.msgError('无行名行号记录');
          this.$set(this.submitParams, "recName", null);
        }
      }).catch(err=>{
        this.msgError('无行名行号记录');
        this.$set(this.submitParams, "recName", null);
      });
    },

    bizTypeChange(code){
      let dictKeyPre = `BIZ_TYPE_${code}`;
      this.getDicts(dictKeyPre).then(response => {
        console.log(response)
        this.bizTypeList = response.result;
        this.$set(this.submitParams, "bizType", '');
      });
    },

    bizCtgyChange(code) {
      //联动修改bizCtgy
      let dictKeyPre = `BIZ_CTGY_${code}`;
      this.getDicts(dictKeyPre).then(response => {
        this.bizCtgyList = response.result;
        this.$set(this.submitParams, "bizCtgy", '');
      });

    },



  }
};
</script>
